<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>大数据展示效果</title>
  <style>
     .echarts {
      display: flex;
      flex-wrap: wrap;
      padding: 0;
      margin: 0;
      list-style: none;
     }
     .echarts li{
       width: 15%;
       margin: 5px;
     }
     .echarts li a{
       color: cadetblue;
     } 
     h2{
       text-align: center;
       /* border: 1px solid #06a11b; */
       padding: 10px 0;
       background: coral;
       border-radius: 5px;
     }
  </style>
</head>

<body>

<h2>大数据展示效果</h2>
  <ul id="echarts" class="echarts">
    <li></li>
  </ul>


  <script>
    let d = [
      // './效果图/index.html',
      './echarts/zyzy/index.html',
      './echarts/lj/index.html',
      './echarts/rq/index.html',
      './echarts/sl/index.html',
      './echarts/hb/index.html',
      './echarts/yj/index.html'
      
    ]
    let li = '';
    d.map(function (ii, index) {
     let arr= ii.split('/');
      li += '<li><a href="' + ii + '" target="_blank">案例'+(index+1)+'【'+arr[2]+'】' + '</a></li>'
    })

    document.querySelector('#echarts').innerHTML = li;

  </script>


</body>

</html>